<template>
  <div
    :class="[memberConstitutionShow ? 'page_body dialog_show' : 'page_body']"
  >
    <div class="home_top">
      <img
        class="home_top_back"
        src="../../assets/image/black_icon01.png"
        alt="返回"
        @click="toBackFn()"
      />
      <div class="home_top_title">{{ topTitle }}</div>
    </div>
    <div class="referee_member_body">
      <div
        style="
          width: 100vw;
          display: flex;
          flex-direction: column;
          align-items: center;
        "
      >
        <div class="referee_member_from_box">
          <div class="referee_member_from_item">
            <div class="referee_member_body_title">
              上海市篮球协会第十一届个人会员入会申请表
            </div>
          </div>
          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              姓名
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.name"
              maxlength="6"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              性别
            </div>
            <div class="border_item_popup_box">
              <div
                :class="[
                  userData.sex == '请选择'
                    ? 'border_item_popup no_value_item'
                    : 'border_item_popup',
                ]"
              >
                {{ userData.sex == "请选择" ? "" : userData.sex }}
              </div>
              <img src="../../assets/image/to_icon03.png" class="popup_icon" />
            </div>
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              籍贯
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.native_place"
              maxlength="10"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              学历
            </div>
            <div class="border_item_popup_box">
              <div
                :class="[
                  userData.education == '请选择'
                    ? 'border_item_popup no_value_item'
                    : 'border_item_popup',
                ]"
              >
                {{ userData.education == "请选择" ? "" : userData.education }}
              </div>
              <img src="../../assets/image/to_icon03.png" class="popup_icon" />
            </div>
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              政治面貌
            </div>
            <div class="border_item_popup_box">
              <div
                :class="[
                  userData.political_status == '请选择'
                    ? 'border_item_popup no_value_item'
                    : 'border_item_popup',
                ]"
              >
                {{
                  userData.political_status == "请选择"
                    ? ""
                    : userData.political_status
                }}
              </div>
              <img src="../../assets/image/to_icon03.png" class="popup_icon" />
            </div>
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              证件号
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.identity_number"
              maxlength="30"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              电话
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.phone"
              maxlength="11"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              工作单位
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.company"
              maxlength="20"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              职务
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.position"
              maxlength="10"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              常住地址
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.address"
              maxlength="30"
              disabled
            />
          </div>

          <div class="referee_member_from_item">
            <div class="border_item_title">
              <div class="border_item_title_tips">*</div>
              邮编
            </div>
            <input
              class="referee_member_from_item_input"
              type="text"
              placeholder="请输入"
              v-model="userData.postcode"
              maxlength="10"
              disabled
            />
          </div>

          <div class="form_title">
            <div class="border_item_title_tips">*</div>
            执裁经历
          </div>

          <div class="form_textarea_box">
            <textarea
              class="form_textarea"
              rows="10"
              v-model="userData.tournament_experience"
              disabled
            ></textarea>
          </div>

          <div class="referee_member_from_send_btn" @click="toBackFn()">
            返回
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<style src="../../assets/css/referee/refereeMemberView.css" scoped></style>

<script>
import { Indicator, Toast } from "mint-ui";

export default {
  name: "RefereeMemberView",
  components: {},
  data() {
    return {
      baseAPIUrl: this.$store.state.baseAPIUrl,
      topTitle: "注册信息",
      memid: "", // 平台中用户id
      userData: {
        name: "", // 姓名
        sex: "请选择", // 性别
        native_place: "", // 籍贯
        education: "请选择", // 学历
        political_status: "请选择", // 政治面貌
        identity_number: "", // 证件号
        phone: "", // 手机号
        company: "", // 工作单位
        position: "", // 职务
        address: "", // 常住地址
        postcode: "", // 邮编
        tournament_experience: "", // 执裁经历
        tournament_shanghai_val: [],
      },
    };
  },
  created: function () {
    this.getDetailDataFn();
  },
  methods: {
    // 获取用户信息
    getDetailDataFn: function () {
      let that = this;
      let url = "/mobile/getRefereeVipInfo";
      let data = {};
      Indicator.open();
      this.axios
        .post(url, data)
        .then((response) => {
          Indicator.close();
          if (response.code == 0) {
            that.userData.name = response.info.name;
            that.userData.sex = response.info.sex;
            that.userData.native_place = response.info.native_place;
            that.userData.education = response.info.education;
            that.userData.political_status = response.info.political_status;
            that.userData.identity_number = response.info.identity_number;
            that.userData.phone = response.info.phone;
            that.userData.address = response.info.address;
            that.userData.company = response.info.company;
            that.userData.position = response.info.position;
            that.userData.postcode = response.info.postcode;
            that.userData.tournament_experience =
              response.info.tournament_experience;
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 返回
    toBackFn: function () {
      this.$router.go(-1);
    },
  },
};
</script>
